<template>
	<span class="text-box__item ellipsis" :class="{'text-box__item__pr':disableClose}">
		<slot></slot><span @click.stop="close" v-if="!disableClose" class="V7_iconfont V7_iconV7tubiao_guanbi"></span>
	</span>
</template>
<script lang="ts">
import { Component, Vue, Prop } from 'vue-property-decorator';
@Component({
  name: 'departmentLabel'
})
export default class extends Vue {
  @Prop({ default: () => ({}) }) private item: any; // 标签
  @Prop({ default: false }) private disableClose: any; // 是否禁用关闭
  private close () {
    this.$emit('close');
  }
}
</script>
<style lang="stylus" scoped>
.text-box__item {
	background rgba(0, 0, 0, 0.03)
	border-radius 4px
	padding 5px
	font-size 12px
	text-align center
	display inline-block
	box-sizing border-box
	line-height normal
	vertical-align middle
	min-width 60px
	padding-right 16px
	position relative
	.V7_iconV7tubiao_guanbi {
		position absolute
		top 50%
		transform translateY(-50%)
		right 3px
		font-size 12px
		color #000000
		opacity 0.3
	}
}
.text-box__item__pr {
	padding-right 5px
}
</style>
